<template>
  <div>
    <el-card>
      <el-form :model="form" size="mini" label-position="top" ref="form">
        <el-row :gutter="10">
          <el-col :lg="4" :md="6">
            <el-form-item label="开始日期" prop="startDate">
              <el-date-picker size="mini" style="width:100%;" v-model="form.startDate" type="date"
                value-format="yyyyMMdd" placeholder="开始日期" :picker-options="pickerOptionsStart" @change="changeStart">
              </el-date-picker>
              <!-- <el-input v-model="form.startDate" placeholder="请输入开始日期"></el-input> -->
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="结束日期" prop="endDate">
              <el-date-picker style="width:100%;" size="mini" v-model="form.endDate" type="date" value-format="yyyyMMdd"
                placeholder="结束日期" :picker-options="pickerOptionsEnd" @change="changeEnd">
              </el-date-picker>
              <!-- <el-input v-model="form.endDate" placeholder="请输入结束日期"></el-input> -->
            </el-form-item>
          </el-col>
          <el-col :lg='24' :md='12' style="margin-top:8px;">
            <el-button type="primary" icon="el-icon-search" size='mini' @click="queryData">查询
            </el-button>
            <el-button type="warning" size="mini" icon="el-icon-refresh" @click="resetForm('form')">重置</el-button>
            <!-- <el-button type="primary" size="mini" icon="el-icon-plus" @click="applicate">新增换班申请</el-button> -->
          </el-col>
        </el-row>
      </el-form>
     
      <br />
      <el-row>
        <el-table :data="tableData">
          <el-table-column prop="BATCHDATE" label="批次日期" align="center" width="120">
             <template slot-scope="scope">
              <div>
                {{scope.row.BATCHDATE | timeFormat}}
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="BATCHNO" label="批次号" align="center" width="250"></el-table-column>
          <el-table-column prop="GENIDFLAG" label="生成方式" align="center" width="150" :formatter='genIdFlagFormat'></el-table-column>
          
          <el-table-column prop="DEALSTEP" label="处理步骤" align="center" width="120" :formatter='dealStepFormat'></el-table-column>
          <el-table-column prop="DEALSTATUS" label="处理状态" align="center" width="120" :formatter='dealStatusFormat'></el-table-column>
          <el-table-column prop="PROCNUM" label="处理次数" align="center" width="120"></el-table-column>
          <el-table-column prop="NOTICEBATCHNO" label="数据源批次号" width="120"></el-table-column>
          <el-table-column prop="DEALCODE" label="处理码" width="100"></el-table-column>
          <el-table-column prop="DEALMSG" label="处理信息" width="100"></el-table-column>
          <el-table-column prop="CRTDATETIME" label="创建时间" width="100">
            <template slot-scope="scope">
              <div>
                {{scope.row.CRTDATETIME | timeFormat}}
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="ALTDATETIME" label="修改时间" width="100">
            <template slot-scope="scope">
              <div>
                {{scope.row.ALTDATETIME | timeFormat}}
              </div>
            </template>
          </el-table-column>
        </el-table>
        <div style="text-align:right;margin-top:20px;" v-show="tableData">
          <el-pagination  :current-page="currentPage" background
            :page-size="pageSize"
            layout="total, prev, pager, next, jumper"
            :total="totalRcrdNum"
            @current-change="changePage">
          </el-pagination>
          </div>
      </el-row>
    </el-card>
  </div>
</template>
<script>
import request from "@/common/utils/requestWFM";
import query from '@/message/wfm/FTEForecast/batchManage/query';
import toolBox from '@/common/utils/toolBox'
import selectTree from "@/components/selectTree5/"
import getGlobalParams from "@/common/utils/getGlobalParams";
  export default{
    components: {
      selectTree
    },
    filters:{
      timeFormat(val){
        if(val == ''){
          return ''
        }
        return toolBox.timeFormat(val)
      },
    },
    data(){
      return {
        tableData:[],
        form: { //表单数据
          startDate: '',
          endDate: '',
          branch: {
            BRANCHNO: this.$store.getters.BranchNum,
            BRANCHNAME: this.$store.getters.BranchName
          },
          
        },
        currentPage: 1, //表格当前页
        pageSize: getGlobalParams.get("PageSize"),
        totalRcrdNum: 0,
        statusOption: [{
            label: '对私',
            value: '01'
          },
          {
            label: '对公',
            value: '02'
          },
        ],
        
        GENIDFLAG: getGlobalParams.get("GENIDFLAG"),
        DEALSTEP: getGlobalParams.get("DEALSTEP"),
        DEALSTATUS: getGlobalParams.get("DEALSTATUS"),
        isShow: false
      }
    },
    methods: {
      changePage(val) {
        this.currentPage = val;
        this.queryData();
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
      genIdFlagFormat(row, column){
        return this.GENIDFLAG[row[column.property]];
      },
      dealStepFormat(row, column){
        return this.DEALSTEP[row[column.property]];
      },
      dealStatusFormat(row, column){
        return this.DEALSTATUS[row[column.property]];
      },
      transTypeFormat(row, column) {
        
        if (row.TRANSTYPE == "01") {
          return "对私";
        } else if (row.TRANSTYPE == "02") {
          return "对公";
        } else {
          return "";
        }
      },
      async queryData(){
        let that = this;
        let resBody = new query();
        resBody.data.STARTDAY = this.form.startDate;
        resBody.data.ENDDAY = this.form.endDate;
        resBody.data.PageFlag= '4';
        resBody.data.CurrPage = this.currentPage;
        resBody.data.PageRowNum = this.pageSize;
        let response =await request(resBody);
        console.log(response)
        if (response.SYS_HEAD.ReturnStatus == 'S') {
          this.tableData = response.BODY.struct
          this.totalRcrdNum = response.BODY.TotalRowNum
        }else{
          this.$message({
              type: "error",
              message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
            })
        }
      },
      getBranch(data) {
        this.form.branch.BRANCHNO = data.BRANCHNO
        this.form.branch.BRANCHNAME = data.BRANCHNAME
      },
      changeStart() {
        this.pickerOptionsEnd = Object.assign({}, this.pickerOptionsEnd, {
          disabledDate: (time) => {
            if (this.form.startDate) {
              return time.getTime() < Date.parse(this.form.startDate.slice(0, 4) + '-' + this.form
                .startDate.slice(4, 6) +
                '-' + this.form.startDate.slice(6, 8)) - 8.64e7
            } else {
              return time.getTime() < Date.now();
            }
          }
        })
      },
      changeEnd() {
        this.pickerOptionsStart = Object.assign({}, this.pickerOptionsStart, {
          disabledDate: (time) => {
            if (this.form.endDate) {
              return time.getTime() > Date.parse(this.form.endDate.slice(0, 4) + '-' + this.form.endDate
                .slice(4, 6) + '-' +
                this.form.endDate.slice(6, 8))
            } else {
              // return time.getTime() < Date.now();
            }
          }
        })
      },
    },
    created(){
      this.form.startDate = toolBox.getCurrentMonthFirstDay();
      this.changeStart();
      this.form.endDate = toolBox.getCurrentMonthLastDay();
      this.changeEnd();
    },
    mounted() {
      this.queryData()
    },
  }
</script>